import fa from "element-ui/src/locale/lang/fa";

export default {
  name: 'e-table-can-edit',
  data() {
    return {
      list: [
        {
          date: '',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518'
        },
        {
          date: '2016-05-04',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1517'
        },
        {
          date: '2016-05-01',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1519'
        },
        {
          date: '2016-05-03',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1516'
        }
      ],
      option: {
        isMenuEdit: false,
        isMenuDelete: false,
        isShowTopMenu: true,
        column: [
          {
            label: '姓名',
            prop: 'name',
            slotEditName: 'editName',//编辑插槽
          },
          {
            label: '地址',
            prop: 'address',
            slotEditName: 'editAddress'
          },
          {
            label: '时间',
            prop: 'date',
            slotEditName: 'editDate',
          },
        ],
      },
      copyEditData: {},//复制编辑的数据
    }
  },
  watch: {},
  mounted() {
  },
  methods: {
    /** 新增一行数据*/
    addTableData() {
      let paramData = {
        $canEdit: true,//开启编辑模式
        name: '',
        address: '',
        date: '',
      };
      this.list.push(paramData);
    },
    /** 编辑*/
    handleEditData(ev) {
      /** 当前所有的行字段 data 数据 index表单行的索引*/
      console.log('data---编辑==========', ev);
      if (ev.data.$canEdit) { // 点击保存的
        console.log('点击保存的', ev.data);
        this.$set(ev.data, '$canEdit', false);
        return;
      }
      /** 复制暂存当前的数据,只要是为了取消时，不请求数据，还原之前的数据*/
      this.copyEditData[ev.index] = JSON.parse(JSON.stringify(ev.data));
      /** 设置为可以编辑的状态*/
      this.$set(ev.data, '$canEdit', true);
    },
    /** 取消 初始化当前一条数据*/
    handleCancelEditData(ev) {
      /** 设置为可以编辑的状态*/
      ev.data.$canEdit = false;
      this.$set(ev.data, '$canEdit', false);
      let currentEditTableData = this.copyEditData[ev.index];
      for (let ol in currentEditTableData) {
        if (ev.data.hasOwnProperty(ol)) {
          ev.data[ol] = currentEditTableData[ol];
        }
      }
      console.log(this.copyEditData[ev.index]);
    },
  },
}